package com.abc.robot01.fragment

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicText
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.DpSize
import androidx.compose.ui.unit.dp
import androidx.fragment.app.Fragment
import androidx.fragment.app.viewModels
import com.abc.robot01.activity.CustomStyledTextField
import com.abc.robot01.activity.CustomerRenderDetails
import com.abc.robot01.activity.MYBLACK
import com.abc.robot01.activity.MYBLACK_Percent10
import com.abc.robot01.activity.MYBLACK_Percent5
import com.abc.robot01.activity.MYBLUE
import com.abc.robot01.activity.MYWhilte_Percent40
import com.abc.robot01.activity.MyButton01
import com.abc.robot01.activity.MyFont_Size
import com.abc.robot01.activity.MyRoundedCornerShape2
import com.abc.robot01.activity.SystemFragmentBackground
import com.abc.robot01.activity.px
import com.abc.robot01.activity.startActivity
import com.abc.robot01.retrofit.bean.Customer
import com.abc.robot01.vivemodel.CustomersViewModel

/**
 *  客户管理
 */
class CustomersFragment : Fragment() {

    private val viewModel: CustomersViewModel by viewModels()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        viewModel.load()
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        val composeView = ComposeView(requireContext()).apply {
            setContent {
                SystemFragmentBackground {
                    Column(
                        modifier = Modifier
                            .fillMaxWidth()
                            .padding(start = 30.px, top = 30.px),
                        verticalArrangement = Arrangement.Center,
                    ) {
                        Row {
                            BasicText(
                                text = "用户姓名",
                                style = TextStyle(
                                    fontSize = MyFont_Size,
                                    color = MYBLACK
                                ),
                                modifier = Modifier.align(Alignment.CenterVertically)
                            )
                            Spacer(modifier = Modifier.width(20.px))
                            CustomStyledTextField(
                                placeHolder = "请输入",
                                search = false,
                                onValueChange = {
                                    viewModel.customerName.value = it
                                    viewModel.request(
                                        customerName = it,
                                        customerPhone = viewModel.customerPhone.value
                                    )
                                })
                            Spacer(modifier = Modifier.width(30.px))
                            BasicText(
                                text = "用户手机",
                                style = TextStyle(
                                    fontSize = MyFont_Size,
                                    color = MYBLACK
                                ),
                                modifier = Modifier.align(Alignment.CenterVertically)
                            )
                            Spacer(modifier = Modifier.width(30.px))
                            CustomStyledTextField(
                                placeHolder = "请输入",
                                search = false,
                                onValueChange = {
                                    viewModel.customerPhone.value = it
                                    viewModel.request(
                                        customerPhone = it,
                                        customerName = viewModel.customerName.value
                                    )
                                })
                            Spacer(modifier = Modifier.width(30.px))
                            BasicText(
                                text = "标签",
                                style = TextStyle(
                                    fontSize = MyFont_Size,
                                    color = MYBLACK
                                ),
                                modifier = Modifier.align(Alignment.CenterVertically)
                            )
                            Spacer(modifier = Modifier.width(20.px))


//        TextField(
//            value = textState.value,
//            onValueChange = { textState.value = it },
//            label = { Text("Enter text") },
//            modifier = Modifier
//                .padding(16.dp)
//        )
//        Button013("查询",containerColor=Color.Blue)
                        }
                        Spacer(modifier = Modifier.height(30.px))
//                  ColoredSurface()
                        ListHeader();
                        DataList2(::edit);
                    }
                }
            }
        }

        return composeView
        // Return the ComposeView as the root view of the fragment
//        return composeView
//        _binding = Fragment03Binding.inflate(inflater, container, false)
//        return binding.root

    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

//        binding.button03.setOnClickListener {
//            findNavController().navigate(R.id.action_Fragment03_to_FirstFragment)
//        }
    }

    override fun onDestroyView() {
        super.onDestroyView()
//        _binding = null
    }

    private fun edit(id: Int) {
//    startActivity<>()
    }

    private fun delete(id: Int) {
//    startActivity<>()
    }


    @Composable
    fun DataList2(edit: (id: Int) -> Unit = { }) {
        val items: List<Customer> by viewModel.customerList.collectAsState()
//    val items = List(5) { "Item #$it" }
        LazyColumn(
            modifier = Modifier
                .width(1800.px)
                .background(Color.Transparent)
        ) {
            itemsIndexed(items) { index, item ->
                val isLastItem = index == items.lastIndex

                //不能使用row的原因是修改时间要和title对齐.
                Box(
                    modifier = Modifier
                        .padding(start = 0.px)
                        .height(90.px)
                        .width(1600.px)
                        .background(
                            color = MYWhilte_Percent40, // 背景颜色
                            shape = if (isLastItem) MyRoundedCornerShape2 else RoundedCornerShape(0)
                        )
                ) {
                    BasicText(
                        modifier = Modifier.offset(30.px, 33.px),
                        text = item.customerPhone,
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )

                    BasicText(
                        modifier = Modifier.offset(268.px, 33.px),
                        text = item.customerName,
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )
                    BasicText(
                        modifier = Modifier.offset(492.px, 33.px),
                        text = item.renderCount.toString(),
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )

                    BasicText(
                        modifier = Modifier.offset(796.px, 33.px),
                        text = item.renderTotalAmount.toString(),
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )

                    BasicText(
                        modifier = Modifier.offset(947.px, 33.px),
                        text = item.latestCreateTime.toString(),
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )

                    BasicText(
                        modifier = Modifier.offset(1293.px, 33.px),
                        text = item.latestAmount.toString(),
                        style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                            fontSize = MyFont_Size,
                            color = MYBLACK
                        ),
                    )

                    MyButton01(
                        shape = RoundedCornerShape(8.px),
                        modifier = Modifier.offset(x = 1662.px, y = 21.px),
                        text = "详情",
                        containerColor = MYBLUE,
                        size = DpSize(108.px, 48.px)
                    ) {
                        edit(index)
                        requireContext().startActivity<CustomerRenderDetails> {
                            putExtra("customerName", item.customerName)
                            putExtra("customerPhone", item.customerPhone)
                            putExtra("totalAmount", item.renderTotalAmount.toString())
                        }
                    }
                }
                if (isLastItem.not()) {
                    HorizontalDivider(
                        modifier = Modifier.fillMaxWidth(),
                        thickness = 1.px,
                        color = MYBLACK_Percent10
                    )
                }
            }
        }
    }

    @Composable
    fun ListHeader() {
        val shape = RoundedCornerShape(
            topStart = 4.dp,
            topEnd = 4.dp,
            bottomStart = 0.dp,
            bottomEnd = 0.dp
        )

        Surface(
            modifier = Modifier
                .width(1800.px)
                .height(
                    56.px
                ),
            color = MYBLACK_Percent5,
            shape = shape
        ) {
            Row(
                verticalAlignment = Alignment.CenterVertically,
                modifier = Modifier.padding(start = 30.px)
            ) {
                BasicText(
                    text = "用户手机",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )
                Spacer(modifier = Modifier.width(141.px))

                BasicText(
                    text = "用户姓名",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )
                Spacer(modifier = Modifier.width(129.px))
                BasicText(
                    text = "渲染总次数",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )
                Spacer(modifier = Modifier.width(128.px))
                BasicText(
                    text = "渲染总金额",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )

                Spacer(modifier = Modifier.width(86.px))
                BasicText(
                    text = "最近购买时间",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )

                Spacer(modifier = Modifier.width(121.px))
                BasicText(
                    text = "最近购买金额",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )

                Spacer(modifier = Modifier.width(305.px))
                BasicText(
                    text = "查看详情",
                    style = TextStyle(
//                          fontWeight = FontWeight.Bold,
                        fontSize = MyFont_Size,
                        color = MYBLACK
                    ),
                )


            }
        }

    }

}


